/*
 * @Description:
 * @Autor: fage
 * @Date: 2022-07-25 17:41:49
 * @LastEditors: chenbinfa
 * @LastEditTime: 2022-09-07 11:51:19
 * @description: 描述信息
 * @author: chenbinfa
 */
import React, { useRef, useState, useEffect } from "react";
import { DatePicker, Input, InputNumber, Spin, Modal, Button, Dropdown, Descriptions, Select, Space, Table, message, Tabs, Popconfirm, Checkbox, Card, Form } from "antd";
import { UserOutlined, DownOutlined, DeleteOutlined, SwapRightOutlined } from "@ant-design/icons";
import _ from "lodash";
import { useNavigate, useParams, NavLink } from "react-router-dom";
import "./ThTable.less";
import { formatArr } from "@/utils";

const { Option } = Select;
const { Column, ColumnGroup } = Table;
const { TabPane } = Tabs;
const { RangePicker } = DatePicker;
const { TextArea } = Input;
let runCount = 0;
let dics = [];

export function ThDetail({ props, ajax, detailInfo }) {
	runCount++;
	console.log("ThDetail render count", runCount);
	// const { q } = useParams();
	const [loading, setLoading] = useState(false);
	const [id, setId] = useState(detailInfo.id);
	const [detail, setDetail] = useState(detailInfo);
	const [columns, setColumns] = useState([]);

	useEffect(() => {
		// if (!q) {
		// 	if (detailInfo && detailInfo.id) {
		// 		setId(detailInfo.id);
		// 	} else {
		// 		return message.error("ID not found");
		// 	}
		// } else {
		// 	if (q != id) {
		// 		setId(q);
		// 	}
		// }
		formatArr(props.columns);
		setColumns(props.columns);
	}, []);
	useEffect(async () => {
		setLoading(true);
		let params = {};
		if (ajax.params) {
			params = _.cloneDeep(ajax.params);
		}
		params.id = id;
		if (!id) return;
		let result = await ajax.method(params);
		if (!result || result.msg != "ok") {
			setLoading(false);
			return message.error(result.msg);
		}
		setDetail(result.data);
		setLoading(false);
	}, [id]);
	return (
		<Spin tip="Loading..." spinning={loading && !detail}>
			<Descriptions bordered column={1}>
				{columns.map(t => {
					return (
						<Descriptions.Item label={t.title} key={t.dataIndex}>
							{t.render ? t.render(detail[t.dataIndex], detail, index) : detail[t.key]}
						</Descriptions.Item>
					);
				})}
			</Descriptions>
		</Spin>
	);
}
